<template>
  <div>
    <!-- 轮播下方配置 -->
    <el-button type="primary" @click="add">添加</el-button>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="label" label="内容" />
      <el-table-column prop="num" label="数量" />
      <el-table-column prop="unit" label="单位" />
      <el-table-column prop="unit" label="操作" width="200">
        <template #default="scope">
          <el-button type="primary" link @click="edit(scope.row)">修改</el-button>
          <el-popconfirm title="确定要删除吗?" confirm-button-text="确定" cancel-button-text="取消" @confirm="del(scope.row)">
            <template #reference>
              <el-button type="danger" link>删除</el-button>
            </template>
          </el-popconfirm>
        </template>
      </el-table-column>
      <!-- <el-table-column prop="more" label="是否显示+号" /> -->

    </el-table>

    <el-dialog v-model="dialogVisible" title="Tips" width="30%">
      <el-form :model="form" label-width="120px" style="padding-right: 20px;">
        <el-form-item label="内容">
          <el-input v-model="form.label" />
        </el-form-item>
        <el-form-item label="数量">
          <el-input v-model="form.num" />
        </el-form-item>
        <el-form-item label="单位">
          <el-input v-model="form.unit" />
        </el-form-item>
        <!-- <el-form-item label="是否显示+号">
          <el-input v-model="form.more" />
        </el-form-item> -->

      </el-form>

      <template #footer>
        <span class="dialog-footer">
          <el-button @click="dialogVisible = false">取消</el-button>
          <el-button type="primary" @click="enter_add">
            确认
          </el-button>
        </span>
      </template>
    </el-dialog>

  </div>
</template>
 
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import http from '../../../http'
import { useCounterStore } from '../../../current/index'
import { storeToRefs } from 'pinia' // cnpm i pinia --save  2.1.3
import { ElMessage } from 'element-plus'
const store = useCounterStore()
const { userInfo } = storeToRefs(store) //  数据

// const tableData = ref([{ num: 328, label: '为行业里328家业主提供服务', unit: '家', more: false }])
const tableData = ref([])
const dialogVisible = ref(false)
const form = ref({
  label: '',
  num: '',
  unit: '',
  more: ''
})

const is_add_edit = ref('')
const add = () => {
  is_add_edit.value = 'add'
  dialogVisible.value = true

  //   `INSERT INTO webindex (label,num,unit,more) VALUES('哈哈哈哈哈哈哈哈','100','家','2')`
}

const id = ref('')
const edit = (row) => {
  console.log(row)
  form.value.label = row.label
  form.value.num = row.num
  form.value.unit = row.unit
  form.value.more = row.more
  id.value = row.id
  is_add_edit.value = 'edit'

  dialogVisible.value = true
}

const enter_add = async () => {
  if (is_add_edit.value === 'add') {
    const res = await adminsql(
      `INSERT INTO webindex (label,num,unit,more) VALUES('${form.value.label}','${form.value.num}','${form.value.unit}','${form.value.more}')`,
      'website'
    )
    ElMessage.success(res)
    console.log(res)
    dialogVisible.value = false
  } else if (is_add_edit.value == 'edit') {
    const res = await adminsql(
      `UPDATE webindex SET label='${ form.value.label }',num='${form.value.num}',unit='${form.value.unit}' WHERE id = '${id.value}'`,
      'website'
    )
    ElMessage.success(res)
    dialogVisible.value = false
    console.log(res);
   

  }
  await get_list()
}

const del = async (row) => {
  const res = await adminsql(`DELETE FROM webindex WHERE id = ${row.id}`, 'website')
  console.log(res)
  if (res) {
    ElMessage.success(res)
  }
  await get_list()
}

onMounted(() => {
  get_list()
})

// const list = ref([])
const get_list = async () => {
  const res = await http.corsApi('/', 'post', {
    packID: '123456',
    packageType: 'adminSql',
    packageContent: {
      AgentUserName: userInfo.value.username,
      AgentUserPassword: userInfo.value.password,
      sql: `select * from webindex`,
      dbName: 'website'
    }
  })
  console.log(res)

  if (res.packageContent.packageStatus == 0 && res.packageContent.packageMsg != '成功') {
    tableData.value = JSON.parse(res.packageContent.packageMsg)
  } else {
    tableData.value = []
  }
}

const adminsql = async (sql, dbName) => {
  const res = await http.corsApi('/', 'post', {
    packID: '123456',
    packageType: 'adminSql',
    packageContent: {
      AgentUserName: userInfo.value.username,
      AgentUserPassword: userInfo.value.password,
      sql: sql,
      dbName: dbName
    }
  })
  console.log(res)

  if (res.packageContent.packageStatus == 0) {
  }

  return res.packageContent.packageMsg
}

defineExpose({
  get_list
})
</script> 

<style scoped>
</style>